
import React,{Component} from 'react'
import close from     'assets/images/close.png';
import logo from      'assets/images/user.png'
import {Popconfirm,message,Menu, Icon, Button} from 'antd'
import {Link} from 'react-router'
import {exit,User,UserInit} from 'action/InteractionRequest'
import {Main,Back,Ajax} from 'config/requestRouter'
import axios from 'axios'


const iToken = sessionStorage.token ? sessionStorage.token:'';

const {SubMenu} = Menu;


export default class Home extends Component{
	
	constructor(props){
		
		super(props)
		this.state={
			userName:'',
			collapsed:false,
			Imenu1:'',
			Imenu2:'',
			Imenu3:'',
			Imenu4:'',
			MenuKeys:0,
			MentNumber:'menu1'
		}
	}
	
	Menus(){
		
	
		
		UserInit(sessionStorage.userId).then((data)=>{

			if(data.some((item)=>item.code=='/facilityModel')){
				this.setState({Imenu1:'menu1'})}
			
			if(data.some((item)=>item.code=='/mediaFacility')){
				this.setState({Imenu2:'menu2'})}
			
			if(data.some((item)=>item.code=='/facilityAssets')){
				this.setState({Imenu3:'menu3'})}
			
			if(data.some((item)=>item.code=='/dictionaries')){
				this.setState({Imenu4:'menu4'})}
			
			if(data.some((item)=>item.code=='/facilityModel')){
				this.setState({MenuKeys:0})
			}else if(data.some((item)=>item.code=='/mediaFacility')){
				this.setState({MenuKeys:1})
			}else if(data.some((item)=>item.code=='/facilityAssets')){
				this.setState({MenuKeys:2})
			}else if(data.some((item)=>item.code=='/dictionaries')){
				this.setState({MenuKeys:3})}
		})
		
	}
	
	componentWillMount(){
		
		axios.get(`${Ajax}/admin/operation/permissions?access_token=${iToken}`).then((data)=>{
						sessionStorage.resource_authoration = JSON.stringify(data.data)
					}).catch((error)=>{
						message.error(`${error}`)
						location.href=`${Main}`
					})
		
		if(sessionStorage.token == null){
			
			location.href=`${Main}`;
			
		}else{
			const newData=JSON.parse(sessionStorage.userInfo)
			
			this.setState({
					userName: newData.username
				})
			
			sessionStorage.UserName=newData.username;
		}
	}
	
	componentDidMount(){
	this.Menus();
	}
	
	Exit(){
		sessionStorage.removeItem('MenuKey')
		location.href=`${Main}`;
	}
	
	callBack(){
		sessionStorage.removeItem('MenuKey')
		location.href=`${Back}`;
	}
	
	render(){
		
		const {Imenu1,Imenu2,Imenu3,Imenu4,MenuKeys} = this.state;
		const initMenu = [['menu1'],['menu2'],['menu3'],['menu4']][MenuKeys];
		return(
			<div className="main">
				<header className="main-header">
          <div className="top-left ad-fl cursor" 
          	onClick={this.callBack.bind(this)}>
            <h3>
          		<span>媒</span>
          		<span>体</span>
          		<span>数</span>
          		<span>据</span>
          		<span>平</span>
          		<span>台</span>
            </h3>
            <div className="topDiv">
            	<span className="topSpan">Smedia data terrace</span>
            </div>
          </div>
          <div className="top-right">
            <div className="topSpan ad-fl top-User">
            </div>
            <div className="top-Exit text-align-right">
	            <img className="top-right-user" src={logo} />
	            	<span className="top-rightSpan">{this.state.userName}</span>
	            <Popconfirm title="是否退出登录?" placement="bottomLeft"
	            	onConfirm={ this.Exit.bind(this)}
								 okText="Yes" cancelText="No">
								<img className="handle-ico cursor" src={close} />
								<span className="ad-fr top-Exit-span cursor">退出</span>
							</Popconfirm>
						</div>
          </div>
        </header>
        <div>
	        <article className="article1 ad-fl">
	         	<div style={{ width: 250,marginTop:20,}} title={sessionStorage.MenuKey==null ? 
					 				initMenu:[`${sessionStorage.MenuKey}`]}>
					 		<Menu mode="inline"
					 			defaultSelectedKeys={sessionStorage.MenuKey==null ? 
					 				initMenu:[`${sessionStorage.MenuKey}`]}
					    	style={{ height: '100%', borderRight: 0 }}
					    	onClick={(e)=>{
					    		sessionStorage.MenuKey=e.key;
					    	}}
					  	>
					    	<Menu.Item key='menu1' style={{
					    			display:Imenu1=='' ? 'none':'block'
					    		}} className={sessionStorage.MenuKey =="menu1" ?"ant-menu-item-selected ant-menu-item":"ant-menu-item"}>
						    	<Link to='/facilityModel'>
						    		<Icon type="calculator" />
						    		设备型号
						    	</Link>
						    </Menu.Item>
					    	<Menu.Item key='menu2' style={{
					    			display:Imenu2=='' ? 'none':'block'
					    		}} className={sessionStorage.MenuKey =="menu2" ?"ant-menu-item-selected ant-menu-item":"ant-menu-item"}>
					    		<Link to='/mediaFacility' >
					    		<Icon type="hdd" />
					      	媒体设备
					      	</Link>
					    	</Menu.Item >
					      <Menu.Item key='menu3' style={{
					    			display:Imenu3=='' ? 'none':'block'
					    		}} className={sessionStorage.MenuKey =="menu3" ?"ant-menu-item-selected ant-menu-item":"ant-menu-item"}>
					      	<Link to='/facilityAssets'>
					        	<Icon type="global" />
					        	媒体资源
					        </Link>
					      </Menu.Item>
					      <Menu.Item key='menu4' style={{
					    			display:Imenu4=='' ? 'none':'block'
					    		}}>
					      	<Link to='/dictionaries'>
					        	<Icon type="database" />
					        	数据字典
					      	</Link>
					      </Menu.Item>
					 	 </Menu>
						</div>
	        </article>
					<article className="article2 ad-fl">
						{this.props.children}
					</article>
				</div>
      	
			</div>
		)
	}
}
